<template>
	<view class="songs">
		<u-popup :show="SideMenuShow" mode="left" @close="SideMenuClick">
			<SideMenu></SideMenu>
		</u-popup>
		<Header  :SideMenuShow="SideMenuShow" @SideMenuClick="SideMenuClick"></Header>
		<Tabbar :currentIndex="currentIndex"  @currentChange="currentChange"></Tabbar>
		<Container :currentIndex="currentIndex" @currentChange="currentChange"></Container>
	</view>
</template>

<script>
	import SideMenu from "../home/components/sideMenu.vue"
	import Header from "./components/header.vue"
	import Tabbar from "./components/tabbar.vue"
	import Container from "./components/container.vue"
	export default {
		components: {
			Header,
			Tabbar,
			Container,
			SideMenu,
		},
		data() {
			return {
				SideMenuShow: false,
				currentIndex:0
			}
		},
		onShow() {
			console.log("onShow1111")
		},
		methods: {
			SideMenuClick() {
				this.SideMenuShow = !this.SideMenuShow
			},
			currentChange (val){
				  this.currentIndex=val
			},
		}
	}
</script>


<style lang="scss" scoped>
	.songs {
		width: 750rpx;
		// height: 100%;
		margin: 0 auto;
	}
</style>